import { searchGeo } from '../../api/houseRes'
import config from '../../config/index'
const radiusNum = 10
const c_radius = 10000
Page({
  data: {
    longitude: '',
    latitude: '',
    marks: [] as any[],
    circles: [] as any[]
  },
  //初始化坐标
  initLocation() {
    wx.getFuzzyLocation({
      type: "gcj02",
      success: async (res: any) => {
        const geoRes = await searchGeo(res.longitude, res.latitude, Number(radiusNum).toString())
        if (geoRes.statusCode !== config.SUCCESS_CODE) {
          wx.showToast({
            title: '获取附近房源失败，请重试',
            icon: 'none'
          })
          return
        }
        let marks = [
          {
            id: 0,
            iconPath: '../../static/icons/icon-position.png',
            longitude: res.longitude,
            latitude: res.latitude,
            width: 34,
            height: 40
          }
        ]
        let markerObj = {} as any
        geoRes.data.forEach((item: any) => {
          if (!markerObj[item.id.split('&')[1]]) {
            markerObj[item.id.split('&')[1]] = []
          }
          markerObj[item.id.split('&')[1]].push(item)
        })
        let index = 1
        for (const markerName in markerObj) {
          const markerItem = markerObj[markerName]
          const firstItem = markerItem[0]
          let marker = {
            id: index,
            iconPath: '../../static/icons/icon-building.png',
            longitude: firstItem.longitude,
            latitude: firstItem.latitude,
            width: 30,
            height: 35,
            callout: {
              content: `${markerName}(${markerItem.length})`,
              fontSize: 12,
              textAlign: 'center',
              color: '#fff',
              display: 'ALWAYS',
              padding: 5,
              bgColor: '#4b5ce3',
              borderRadius: '4'
            }
          }
          index++
          marks.push(marker)
        }
        let circles = [
          {
            longitude: res.longitude,
            latitude: res.latitude,
            radius: c_radius,
            color: '#4b5ce3',
            fillColor: '#4b5de331'
          }
        ]
        this.setData({
          longitude: res.longitude,
          latitude: res.latitude,
          marks,
          circles
        })
      }
    })
  },
  regionchange(res: any) {
    if (res.type === 'end') {
      const timer = setTimeout(async () => {
        let centerLoc = res.detail.centerLocation
        //更新marker和center
        const geoRes = await searchGeo(Number(centerLoc.longitude).toString(), Number(centerLoc.latitude).toString(), Number(radiusNum).toString())
        if (geoRes.statusCode !== config.SUCCESS_CODE) {
          wx.showToast({
            title: '获取附近房源失败，请重试',
            icon: 'none'
          })
          return
        }
        if (geoRes.data.length === 0) {
          wx.showToast({ title: '附近暂无房源', icon: 'none' })
        }
        let marks = [
          {
            id: 0,
            iconPath: '../../static/icons/icon-position.png',
            longitude: Number(centerLoc.longitude),
            latitude: Number(centerLoc.latitude),
            width: 34,
            height: 40
          }
        ]
        let markerObj = {} as any
        geoRes.data.forEach((item: any) => {
          if (!markerObj[item.id.split('&')[1]]) {
            markerObj[item.id.split('&')[1]] = []
          }
          markerObj[item.id.split('&')[1]].push(item)
        })
        let index = 1
        for (const markerName in markerObj) {
          const markerItem = markerObj[markerName]
          const firstItem = markerItem[0]
          let marker = {
            id: index,
            iconPath: '../../static/icons/icon-building.png',
            longitude: firstItem.longitude,
            latitude: firstItem.latitude,
            width: 30,
            height: 35,
            callout: {
              content: `${markerName}(${markerItem.length})`,
              fontSize: 12,
              textAlign: 'center',
              color: '#fff',
              display: 'ALWAYS',
              padding: 5,
              bgColor: '#4b5ce3',
              borderRadius: '4'
            }
          }
          index++
          marks.push(marker)
        }
        let circles = [
          {
            longitude: Number(centerLoc.longitude),
            latitude: Number(centerLoc.latitude),
            radius: c_radius,
            color: '#4b5ce3',
            fillColor: '#4b5de331'
          }
        ]
        this.setData({
          marks,
          circles
        })
        clearTimeout(timer)
      }, 1000)
    }
  },
  onLoad() {
    this.initLocation()
  }
})